<template>
  <div class="bar">
    <h4>{{title}}</h4>
    <v-chart :forceFit="true" :height="height" :data="dataSet" :scale="scale">
      <v-tooltip />
      <v-axis />
      <v-bar :position="p" />
    </v-chart>
  </div>
</template>

<script>
export default {
  name: 'Bar',
  props: {
    dataSet: {
      type: Array,
      required: false
    },
    title: {
        type: String,
        required: true
    },
    tickInterval: {
        type: String,
        required: true
    },
    position: {
        type: String,
        required: true
    }
  },
  created(){
    this.p = this.position;
    this.scale.push(
      {
        dataKey: 'y',
        tickInterval: this.tickInterval,
      }
    )
  },
  data () {
    return {
      p:"",
      scale:[],
      height:400
    }
  }
}
</script>

<style scoped lang="less"></style>
